package com.bumpslide.ui.skin.default 
{
	import com.bumpslide.ui.Box;
	import com.bumpslide.ui.Button;
	import com.bumpslide.ui.Label;
	import com.bumpslide.ui.skin.BasicSkin;
	import com.bumpslide.util.Align;

	import flash.filters.BevelFilter;

	/**
	 * Minimal Button Skin
	 * 
	 * @author David Knape
	 */
	public class DefaultButtonSkin extends BasicSkin
	{

		public var background:Box;

		public var textBox:Label;

		
		public function DefaultButtonSkin() 
		{
			super();
			
			background = new Box();
			background.borderColor = 0xaaaaaa;
			background.borderWidth = 1;
			background.cornerRadius = 0;
			
			background.filters = [ new BevelFilter(1.1, 45, 0xcccccc, .5, 0x333333, .5, 1.5, 1.5, 1, 2) ];
			addChild(background);
			
			textBox = new Label();
			//textBox.maxLines = 1;
			addChild(textBox);
		}

		
		public function get hostComponent():Button {
			return _hostComponent as Button;
		}

		
		override public function draw( skinState:String ):void 
		{
			super.draw(skinState);
			
			if(hostComponent == null) return;
			
			if(hostComponent.padding) {
				textBox.padding = hostComponent.padding;
			}
			
			// If we are sizing the button based on the label size,
			// we can't have the label size be undefined
			// force it to a single line
			if(!hostComponent.explicitWidth) {
				textBox.multiline = false;
			}
			
			textBox.text = hostComponent.label;
						
			
			if(hostComponent.label != null && hostComponent.label!="") {
			
				var w:Number;
				var h:Number;
				
				// Label Button
			
				// If button has width explicitly set,
				// use that to size the label and background width
				if(hostComponent.explicitWidth) {
					w = textBox.width = hostComponent.width;
					Align.center(textBox, hostComponent.width, textBox.actualWidth);
				} else {
					w = textBox.actualWidth;
				}
				
				if(hostComponent.explicitHeight) {
					h = hostComponent.height;
					Align.middle(textBox, hostComponent.height, textBox.height);
				} else {
					h = textBox.height;
				}
				
				// use the label width to determine the background width
				background.setSize(w, h);
				
			} else {
				
				// No label
				
				// set the background to the size of the component
				background.setSize( hostComponent.width, hostComponent.height );
			}
						
		} 		

		
		public function _off():void 
		{
			background.color = 0xdddddd;
			textBox.content_txt.textColor = 0x333333;
			alpha = 1.0;
		}

		
		public function _over():void 
		{
			background.color = 0xcccccc;
			textBox.content_txt.textColor = 0x333333;
			alpha = 1.0;
		}

		
		public function _down():void 
		{
			background.color = 0xcccccc;	
			textBox.content_txt.textColor = 0x333333;
			alpha = 1.0;
		}

		
		public function _selected():void 
		{
			background.color = 0x999999;
			textBox.content_txt.textColor = 0xffffff;
			alpha = 1.0;
		}

		
		public function _disabled():void 
		{
			background.color = 0xeeeeee;
			textBox.content_txt.textColor = 0x333333;
			alpha = .5;
		}
	}
}
